<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <style type="text/css">
			div{ 
				width:100px;
				height:100px;
				background:pink;
				margin-top:10px;
				display:none;
			}
        </style>
        <script type="text/javascript">
        	window.onload = function(){
        		var btns = document.getElementsByTagName("button");
        		//alert(btns.length)
        		btns[0].onclick = function(){
        			fn("dome1")
        		};
        		btns[1].onclick = function(){
        			fn("dome2")
        		};
        		btns[2].onclick = function(){
        			fn("dome3")
        		};
        		btns[3].onclick = function(){
        			fn("dome4")
        		};

        		function fn(dome){
        			var dome = document.getElementById(dome)
        			dome.style.display="block"
        		}
        	}
        </script>
    </head>
    <body>
    	<button>1</button>
    	<button>2</button>
    	<button>3</button>
    	<button>4</button>
    	<div id="dome1">1</div>
    	<div id="dome2">2</div>
    	<div id="dome3">3</div>
    	<div id="dome4">4</div>
    </body>
</html>